<template>
    <div class="songhome">
        <van-tabs v-model="active" swipeable sticky tabs-card-height="50px">
          <van-tab title="推荐"><TuiJian/></van-tab>
          <div v-for="(item,index) in tags" :key="index">
            <van-tab :title="item.name">
              <TabsView :tags="item.name"/>
            </van-tab>
          </div>
        </van-tabs>
    </div>
</template>

<script>
import TuiJian from "./components/TuiJian.vue";
import TabsView from "./components/TabsView.vue";
export default {
  data(){
    return{
      active: 1,
      tags:[]
    }
  },
  created(){
    this.getTabData();
  },
  methods: {
    getTabData:function(){
      this.$request('get','/playlist/hot').then((res)=>{
        console.log(res.tags);
        this.tags=res.tags
      })
    }
  },
  components:{
    TuiJian,
    TabsView
 }
}
</script>

<style scoped>
.tabs{
  height: 90%;
}
</style>